<template>
  <el-select :value="value" :placeholder="placeholder" filterable
             remote :remote-method="handleQueryWarehouse" @change="(val)=>$emit('input',val)">
    <el-option v-for="{name,id} in warehouseOptions" :label="name" :value="id" :key="id"/>
  </el-select>
</template>

<script>
export default {
  name: "WarehouseSelect",
  props: ['value', 'placeholder','astrict','source_warehouse','target_warehouse'],
  data() {
    return {
      warehouseOptions: [],
      source_warehouse_id:'',
      target_warehouse_id:''
    }
  },
  watch:{
    source_warehouse(){
      this.source_warehouse_id=this.source_warehouse
      this.handleQueryWarehouse()
    },
    target_warehouse(){
      this.target_warehouse_id=this.target_warehouse
      this.handleQueryWarehouse()
    }
  },
  mounted() {
    this.handleQueryWarehouse()
  },
  methods: {
    async handleQueryWarehouse(name) {
      const res = (await this.$http.get(`/warehouses`, {params: {name, is_manager: this.astrict}})).data
      if(res.code===0){
        if(this.source_warehouse_id){
          this.warehouseOptions = res.data.filter(item=>item.id!==this.source_warehouse_id)
        }else if(this.target_warehouse_id){
          this.warehouseOptions = res.data.filter(item=>item.id!==this.target_warehouse_id)
        }else {
          this.warehouseOptions=res.data
        }
      }else {
        this.$message.error(res.msg)
      }
    }
  }
}
</script>

<style scoped>

</style>
